/* 对话框头部自定义按钮样式 */
.dialog-header-custom {
  user-select: none;
}

.dialog-title-custom {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dialog-buttons-custom {
  flex-shrink: 0;
  margin-right: 20px;
  /* 增加与关闭按钮的距离 */
  // gap: 10px;
  display: flex;
  align-items: center;
}

.dialog-action-btn.el-button {
  height: 28px !important;
  padding: 6px 16px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  cursor: pointer !important;
  user-select: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  min-width: auto !important;
  white-space: nowrap !important;
}

/* 默认按钮样式 */
.dialog-action-btn.el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--info) {
  background: var(--el-fill-color-blank) !important;
  color: var(--el-text-color-regular) !important;
  border: 1px solid var(--el-border-color) !important;
}

.dialog-action-btn.el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--info):hover {
  background: var(--el-fill-color-light) !important;
  border-color: var(--el-border-color-hover) !important;
  color: var(--el-text-color-primary) !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--el-box-shadow-light) !important;
}

.dialog-action-btn.el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--info):active {
  transform: translateY(0) !important;
  background: var(--el-fill-color) !important;
}

/* Primary按钮样式 */
.dialog-action-btn.el-button--primary {
  background: var(--el-color-primary) !important;
  color: var(--el-color-white) !important;
  border: 1px solid var(--el-color-primary) !important;
  font-weight: 500 !important;
  box-shadow: 0 2px 4px rgba(64, 158, 255, 0.15) !important;
}

.dialog-action-btn.el-button--primary:hover {
  background: var(--el-color-primary-light-3) !important;
  border-color: var(--el-color-primary-light-3) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(64, 158, 255, 0.25) !important;
}

.dialog-action-btn.el-button--primary:active {
  transform: translateY(-1px) !important;
  background: var(--el-color-primary-dark-2) !important;
  border-color: var(--el-color-primary-dark-2) !important;
  box-shadow: 0 2px 8px rgba(64, 158, 255, 0.2) !important;
}

/* 其他类型按钮样式 */
.dialog-action-btn.el-button--success {
  background: var(--el-color-success) !important;
  color: var(--el-color-white) !important;
  border: 1px solid var(--el-color-success) !important;
}

.dialog-action-btn.el-button--success:hover {
  background: var(--el-color-success-light-3) !important;
  border-color: var(--el-color-success-light-3) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(103, 194, 58, 0.25) !important;
}

.dialog-action-btn.el-button--info {
  background: var(--el-color-info) !important;
  color: var(--el-color-white) !important;
  border: 1px solid var(--el-color-info) !important;
}

.dialog-action-btn.el-button--info:hover {
  background: var(--el-color-info-light-3) !important;
  border-color: var(--el-color-info-light-3) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(144, 147, 153, 0.25) !important;
}

.dialog-action-btn.el-button--warning {
  background: var(--el-color-warning) !important;
  color: var(--el-color-white) !important;
  border: 1px solid var(--el-color-warning) !important;
}

.dialog-action-btn.el-button--warning:hover {
  background: var(--el-color-warning-light-3) !important;
  border-color: var(--el-color-warning-light-3) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(230, 162, 60, 0.25) !important;
}

/* 禁用状态 */
.dialog-action-btn.el-button:disabled,
.dialog-action-btn.el-button.is-disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

.dialog-action-btn.el-button:disabled:hover,
.dialog-action-btn.el-button.is-disabled:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* 聚焦状态 */
.dialog-action-btn.el-button:focus-visible {
  outline: 2px solid var(--el-color-primary-light-7) !important;
  outline-offset: 1px !important;
}

/* 深色主题优化 */
[data-theme='dark'] .dialog-action-btn.el-button {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

[data-theme='dark'] .dialog-action-btn.el-button--primary {
  box-shadow: 0 2px 4px rgba(64, 158, 255, 0.3) !important;
}

[data-theme='dark'] .dialog-action-btn.el-button--primary:hover {
  box-shadow: 0 6px 16px rgba(64, 158, 255, 0.4) !important;
}

/* 响应式设计 */
@media (max-width: 768px) {
  .dialog-buttons-custom {
    gap: 8px !important;
    margin-right: 24px !important;
  }

  .dialog-action-btn.el-button {
    padding: 6px 12px !important;
    min-width: 60px !important;
  }
}

/* 对话框合理高度设计 */
.el-dialog {
  margin: 0 auto !important;
  max-height: 85vh !important;
  /* 限制最大高度，避免对话框过长 */
  overflow: hidden !important;
  /* 对话框本身不滚动 */
}

.el-dialog__body {
  overflow: auto !important;
  padding: 0 !important;
  min-height: 630px !important;
  /* 统一最小高度 */
  max-height: calc(85vh - 120px) !important;
  /* 内容区域可以滚动 */
}

/* 确保对话框内容区域可以滚动 */
.el-dialog__body>div {
  height: 100% !important;
  overflow: auto !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  /* 内容区域滚动 */
}

/* 优化tabs内容展示 */
.el-dialog__body .el-tabs__content {
  max-height: calc(85vh - 200px) !important;
  /* 为tabs内容预留足够空间 */
  overflow: auto !important;
}

/* 自定义滚动条样式 */
.el-dialog__body::-webkit-scrollbar,
.el-dialog__body>div::-webkit-scrollbar,
.el-dialog__body .el-tabs__content::-webkit-scrollbar {
  width: 6px !important;
}

.el-dialog__body::-webkit-scrollbar-track,
.el-dialog__body>div::-webkit-scrollbar-track,
.el-dialog__body .el-tabs__content::-webkit-scrollbar-track {
  background: var(--el-fill-color-lighter) !important;
  border-radius: 3px !important;
}

.el-dialog__body::-webkit-scrollbar-thumb,
.el-dialog__body>div::-webkit-scrollbar-thumb,
.el-dialog__body .el-tabs__content::-webkit-scrollbar-thumb {
  background: var(--el-border-color) !important;
  border-radius: 3px !important;
}

.el-dialog__body::-webkit-scrollbar-thumb:hover,
.el-dialog__body>div::-webkit-scrollbar-thumb:hover,
.el-dialog__body .el-tabs__content::-webkit-scrollbar-thumb:hover {
  background: var(--el-border-color-hover) !important;
}

/* 大屏幕优化 */
@media (min-width: 1920px) {
  .el-dialog {
    max-width: 1200px !important;
  }
}

@media (min-width: 1440px) and (max-width: 1919px) {
  .el-dialog {
    max-width: 1000px !important;
  }
}

@media (min-width: 1024px) and (max-width: 1439px) {
  .el-dialog {
    max-width: 900px !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .el-dialog {
    max-width: 95vw !important;
  }
}

@media (max-width: 767px) {
  .el-dialog {
    max-width: 98vw !important;
    margin: 10px auto !important;
  }

  .dialog-header-custom {
    padding: 0 8px !important;
  }

  .dialog-title-custom {
    font-size: 16px !important;
  }

  /* 移动端弹窗高度调整 */
  .el-dialog__body {
    min-height: 400px !important;
    max-height: calc(85vh - 100px) !important;
  }

  .el-dialog__body .el-tabs__content {
    min-height: 320px !important;
    max-height: calc(85vh - 180px) !important;
  }

  .el-dialog__body .card-fill {
    min-height: 350px !important;
  }
}

/* 平板设备优化 */
@media (min-width: 768px) and (max-width: 1023px) {
  .el-dialog__body {
    min-height: 450px !important;
  }

  .el-dialog__body .el-tabs__content {
    min-height: 380px !important;
  }

  .el-dialog__body .card-fill {
    min-height: 420px !important;
  }
}